<template>
  <!-- type == click 只是点击事件 没有其他逻辑 -->
  <!-- type == select 并且state为true 表示预约满了 -->
  <view
    class="w-100 h200 ov-hd circle34 show0"
    :class="set_class"
    @click="get_change()"
  >
    <view class="w-100 h100 f-b-c px-2-4 font32 font600 t-20">
      <view>{{ item.activityDate || "--" }} {{ item.weeks || "--" }}</view>
      <view class="f-b-c">
        <text>{{ item.startTime || "--" }}-{{ item.endTime || "--" }}</text>
        <image
          v-if="type == 'click'"
          src="../../../../static/icon_right_0.png"
          class="w32 h32 ml-2"
        />
      </view>
    </view>
    <view
      class="w-100 h100 bg-white re circle-box py-2 f-b-c px-2-4 font24 font font500"
    >
      <view class="fs-n-a h60">
        <view class="w-100 h24 f-s-c t-20">{{
          item.activityName || "--"
        }}</view>
        <view class="w-100 h24 f-s-c t-8">{{
          item.activityAddress || "--"
        }}</view>
      </view>
      <HornMargin type="left-top"></HornMargin>
      <view>
        <view
          class="ws-nr font28 t-20 font600"
          v-if="item.usedNumber >= item.totalNumber"
          >约满</view
        >
        <view v-if="type == 'select' && item.usedNumber < item.totalNumber">
          <image
            v-if="item.id == cur"
            src="../../../../static/icon_select_cur.png"
            class="w48 h48"
          />
          <image
            v-else
            src="../../../../static/icon_select.png"
            class="w48 h48"
          />
        </view>
      </view>
    </view>
  </view>
</template>

<script>
import HornMargin from "../../../../components/horn_margin.vue";
export default {
  components: { HornMargin },
  props: {
    type: {},
    item: {},
    cur: {},
  },
  computed: {
    set_class() {
      let text = "bg-theme";
      // if(this.type == 'select'){
      if (this.item.usedNumber >= this.item.totalNumber) {
        text = "bg-dd";
      } else if (this.item.usedNumber / this.item.totalNumber > 0.8) {
        text = "bg-er";
      }
      // }
      return text;
    },
  },
  methods: {
    get_change() {
      if (this.type == "click") {
      } else {
        // state true 为已约满
        if (this.item.usedNumber >= this.item.totalNumber) {
          uni.showToast({
            title: "已约满，请选择其他时间",
            icon: "none",
          });
        } else {
          // uni.redirectTo({
          // 	url:`/pages/map/activity/details?is_cur_id=${this.item.id}`
          // })
          uni.navigateBack({
            delta: -1,
          });
          uni.$emit("backPage", this.item.id);
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.circle-box {
  border-radius: 0 34rpx 34rpx 34rpx;
}
</style>
